<template>
    <div class="topic">
        <div class="box" v-for="item in TopicData" :key="item.id">
            <img :src=" item.scene_pic_url" class="img">
            <div class="title">{{item.title}}</div>
            <div class="tips">{{item.subtitle}}</div>
            <div class="price">{{item.price_info | RMBformat}}</div>
        </div>
    </div>
</template>

<script>
    import {
        GetTopicData
    } from '@/request/api'
    export default {

        data() {
            return {
                // 专题数据
                TopicData: [],
            }
        },
        created() {
            GetTopicData().then(res => {
                if (res.errno == 0) {
                    this.TopicData = res.data.data
                }
            })
        }
    }
</script>

<style lang="less" scoped>
    .topic {
        .box {
            background-color: #fff;
            text-align: center;
            padding-bottom: 10px;
            margin-bottom: 20px;

            .img {
                width: 100%;
            }

            .title {
                font-size: 18px;
                margin: 10px 0;
            }

            .tips {
                font-size: 16px;
                margin: 20px 0;
                color: #1f1f1f;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            .price {
                color: #9b0000;
                margin-bottom: 10px;
            }
        }
    }
</style>